<template>
  <section class="my-group clearfix">
    <div class="left-box">
      <left-menu :menu="list"></left-menu>
    </div>
    <div class="center-box">
      <router-view></router-view>
    </div>
    <div class="right-box">
      <side-user style="margin-bottom: 10px" :type="1"></side-user>
      <side-list :list="sidelist" ></side-list>
    </div>
  </section>
</template>

<script>
import LeftMenu from "@/components/My/LeftMenu/"
import SideUser from "@/components/My/UserInfo/SideUserinfo"
import SideList from "@/components/SideMenu/SideList"
export default {
  name: 'MyGroup',
  components: {
      LeftMenu,
      SideUser,
      SideList
  },
   data () {
      return {
          list: [
              {
                  id:1,
                  name: '圈子管理',
                  child: [
                      {id: 11,name: '圈子列表', path: '/my/mygroup/list',
                        child:[
                            {id:1,name: '圈子列表', path: '/my/mygroup/publishtheme'},
                            {id:1,name: '圈子列表', path: '/my/mygroup/groupmanage'},
                        ]
                      },
                      {id: 12,name: '通过审核的圈子', path: '/my/mygroup/checked',
                          child:[
                              {id:1,name: '圈子列表', path: ''},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                      {id: 13,name: '未通过审核的圈子', path: '/my/mygroup/unchecked',
                          child:[
                              {id:1,name: '圈子列表', path: ''},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                      {id: 14,name: '被投诉的圈子', path: '/my/mygroup/complaint',
                          child:[
                              {id:1,name: '圈子列表', path: ''},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                  ]
              },
              {
                  id:2,
                  name: '我的发表',
                  child: [
                      {id: 11,name: '帖子列表', path: '/my/mygroup/topiclist',
                          child:[
                              {id:1,name: '圈子列表', path: ''},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                      {id: 12,name: '通过审核的帖子', path: '/my/mygroup/checkedtopic',
                          child:[
                              {id:1,name: '圈子列表', path: ''},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                      {id: 13,name: '未通过审核的帖子', path: '/my/mygroup/uncheckedtopic',
                          child:[
                              {id:1,name: '圈子列表', path: ''},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                      {id: 14,name: '被投诉的帖子', path: '/my/mygroup/complainttopic',
                          child:[
                              {id:1,name: '圈子列表', path: '/my/mygroup/complainttopdelist'},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                      {id: 15,name: '评论/回复', path: '/my/mygroup/reply',
                          child:[
                              {id:1,name: '圈子列表', path: '/my/mygroup/replydelist'},
                              {id:1,name: '圈子列表', path: ''},
                          ]
                      },
                  ]
              }
          ],
          sidelist: [
              {
                  id: 1,
                  name: '竞价排名',
                  child: [
                    {id: 1,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                    {id: 2,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                    {id: 3,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                    {id: 4,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'}
                  ]
              },
              {
                  id: 2,
                  name: '大家正在预约',
                  child: [
                      {id: 21,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                      {id: 22,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                      {id: 23,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                      {id: 24,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'}
                  ]
              },
              {
                  id: 3,
                  name: '新品推荐',
                  child: [
                      {id: 31,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                      {id: 32,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                      {id: 33,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'},
                      {id: 34,title: '【每月限5个名额】高效便捷，量齿定制，改变脸型，功能与美学矫正二...',price: 7800, hot: 20, num: 10, discount: 7.5,img: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1245094042,1192779942&fm=26&gp=0.jpg'}
                  ]
              },
          ],
      }
   },
    created () {
    },
    methods: {
    }
}
</script>

<style lang="less" scoped>
  @import "../../../style/style.less";
  .my-group {
    padding: 30px 0;
    .left-box {
      width: 180px;
      border: 1px solid @border-color;
      background-color: #fafafa;
      float: left;
      margin-right: 20px;
    }
    .center-box {
      float: left;
      width: 700px;
      margin-right: 20px;
      background-color: #fff;
      min-height: 100px;
    }
    .right-box {
      float: left;
      width: 260px;
    }
  }
</style>
